<!-- Standard app header for dev mode only -->
<header class="header header-2">
   <div class="branding">
      <a class="nav-link  nav-icon" href="javascript://">
         <span class="title logo-flag"></span>
         <span class="font_sty">{{pluginName}}</span>
      </a>
   </div>
   <div class="header-nav">
      <a class="nav-link nav-icon" href="javascript://" (click)="goHome()">
         <clr-icon shape="home" size="24"></clr-icon>
      </a>
      <!-- Refresh and Settings buttons without tooltips -->
      <a class="nav-link nav-icon" href="javascript://" (click)="refresh()">
      <clr-icon shape="refresh" size="24"></clr-icon>
      </a>
      <a class="nav-link nav-icon" href="javascript://" (click)="settings()">
         <clr-icon shape="settings" size="24"></clr-icon>
      </a>
      

   </div>
   <div class="header-nav toggle">
   </div>
   <!--<div class="header-actions" style="font-size: 12px; padding-right:5px">-->
         <!-- Two buttons on the right side to switch between English and French translations -->
         <!--<a class="us-flag" [style.opacity]="isFrench ? 0.7 : 1" (click)="setLocale('en')" href="javascript://"></a>
         <a class="fr-flag" [style.opacity]="isFrench ? 1 : 0.7" (click)="setLocale('fr')" href="javascript://"></a>
         <span style="display: inline-flex; align-items: center;">v{{version}}</span>
   </div>-->
</header>

<!-- optional view extension info -->
<div *ngIf="gs.showViewInfo()" class="view-info">Current view extension = {{viewExtension}}
   <button class="btn btn-sm btn-link" (click)="toggleExtensionXml()">{{extensionXml ? 'hide details':'show details'}}</button>
   <pre *ngIf="extensionXml" class="xml-text" [innerText]="extensionXml"></pre>
</div>